<template>
	<view class="container">

		<!-- 搜索框 -->
		<view class="search-section">
			<input style=" background-color: white; width: 95%; height: 60rpx; margin-left: 2.5%;border-radius: 10rpx;"
				placeholder="搜索" />
		</view>
		<!-- 排序方式 -->
		<view style="width: 200rpx;">
			<uni-data-select v-model="value" :localdata="range" @change="change" :clear="false"></uni-data-select>
		</view>

		<!-- 门店信息 -->
		<view style="margin-top: 20rpx;padding-bottom: 20rpx; display: flex;border-bottom: 1rpx solid gainsboro;"
			v-for="washShopInfo in washShopInfo">
			<image style="width: 200rpx;height: 200rpx; margin-top: 10rpx;" src="../../../static/carbaoyang.webp">
			</image>
			<view style=" margin-left:15rpx;">
				<view>
					<text style="font-weight: bold;font-size: 32rpx;">{{washShopInfo.name}}</text>
					<text style="color: cornflowerblue;">{{washShopInfo.distance}}m</text>
				</view>
				<view class="shopstar">
					<!-- 只读状态,默认false：可以手动选择。true:只读 -->
					<uni-rate :readonly="true" :value="washShopInfo.star" />
					<text style="margin-left: 10rpx;">{{washShopInfo.star}}分</text>
					<text style="margin-left: 40rpx;">销量：{{washShopInfo.sales}}</text>
				</view>
				<view class="opentime">
					<text>营业时间: {{washShopInfo.opentime}}</text>
				</view>
				<view class="shopaddress">
					<text>{{washShopInfo.address}}</text>
				</view>
			</view>
		</view>

		<!-- 暂无更多 -->
		<view style="text-align: center;font-size: 26rpx;margin-top: 40rpx;">
			<text>暂无更多</text>
		</view>
	</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: 0,
				range: [{
						value: 0,
						text: "综合排序"
					},
					{
						value: 1,
						text: "距离最近"
					},
					{
						value: 2,
						text: "评分最高"
					},
					{
						value: 3,
						text: "销量最高"
					},
				],
				washShopInfo: [{
					id: 1,
					name: "伟业汽车保养厂（人民路店）",
					distance: 44,
					star: 3,
					sales: 322,
					opentime: "周一至周五 09:00-22:00",
					address: "山阳区人民中路32号"
				}, {
					id: 1,
					name: "伟业汽车保养厂（人民路店）",
					distance: 44,
					star: 3,
					sales: 322,
					opentime: "周一至周五 09:00-22:00",
					address: "山阳区人民中路32号"
				}, {
					id: 1,
					name: "伟业汽车保养厂（人民路店）",
					distance: 44,
					star: 3,
					sales: 322,
					opentime: "周一至周五 09:00-22:00",
					address: "山阳区人民中路32号"
				}],


			};
		},
		methods: {


			change(e) {
				console.log("e:", e);
			},
		}

	};
</script>

<style>
	.container {
		padding: 10px;
	}

	.search-section {
		background-color: rgba(0, 0, 0, 0.05);
		padding-top: 20rpx;
		height: 80rpx;
	}
</style>